@extends('layouts.app')
@include('layouts.nav')
@section('content')
    <div class="container-fluid pic-container">
        <div class="row">
            @foreach($items as $item)
                <div class="col-12 col-sm-6 col-md-4 item">
                    <div class="detail">
                        <div class="title">{{ $item->title }}</div>
                        <div class="date">
                            <i class="bi bi-calendar3"></i>
                            <em>{{ $item->datetime }}</em>
                        </div>
                        <div class="date">
                            <i class="bi bi-eye"></i>
                            <em>{{ $item->view }}</em>
                        </div>
                    </div>
                    <img src="{{ $item->url }}" alt="">
                    <div class="action">
                        <div class="hy-btn mr-2 like" data-id="{{ $item->id }}">
                            @if($item->hasLike)
                                <i class="bi bi-heart-fill text-danger"></i>
                            @else
                                <i class="bi bi-heart"></i>
                            @endif
                            <span>{{ $item->like }}</span>
                        </div>
                        <div class="hy-btn download" data-id="{{ $item->id }}"
                             data-url="{{ $item->url }}"
                             data-resolution="{{ $item->resolution }}">
                            <i class="bi bi-cloud-arrow-down"></i>
                            <span>{{ $item->down }}</span>
                        </div>
                    </div>
                    <a class="detail-link" href="{{ route('home') . '/' . $item->id }}"></a>
                </div>
            @endforeach
        </div>
    </div>
    <div class="container">
        <div class="row">
            <div class="col-12 d-flex justify-content-center">
                {{ $items->links() }}
            </div>
        </div>
    </div>
    @include('layouts.download-modal')
@endsection
